layui.use(['table','layer'],function(){
    var layer = parent.layer === undefined ? layui.layer : top.layer,
        $ = layui.jquery,
        table = layui.table;

    /**
     * 加载数据表格
     */
    var tableIns = table.render({
        id:"userTable",//用于头部工具栏删除的id
        elem: '#userList' //容器元素的id属性值
        ,height: 'full-125' //容器的高度 full-差值
        ,cellMinWidth: 95 //单元格最小宽度
        ,url: ctx + '/user/list'//访问数据的URL(后台的数据接口)
        ,page: true //开启分页
        ,limit: 10 //默认每页显示的条数
        ,limits: [10,20,30,40,50] //分页每页数据可选项
        ,toolbar:'#toolbarDemo' // 开启头部工具栏
        ,cols: [[
            // field：要求field属性值与返回的数据中对应的属性字段名一致
            // title：设置列的标题
            // sort：是否允许排序（默认：false）
            // fixed：固定列
            {type:'checkbox', fixed:'center'}
            ,{field: 'id', title: '编号',  sort: true, fixed: 'left'}
            ,{field: 'userName', title: '用户名', align:'center'}
            ,{field: 'trueName', title: '真实姓名', align:'center'}
            ,{field: 'email', title: '用户邮箱', align:'center'}
            ,{field: 'phone', title: '手机号码', align:'center'}
            ,{field: 'createDate', title: '创建时间', align:'center'}
            ,{field: 'updateDate', title: '更新时间', align:'center'}
            ,{title:'操作',templet:'#userListBar', fixed: 'right', align:'center', minWidth:150}
        ]]
    });

    /**
     * 搜索按钮的点击事件
     */
    $(".search_btn").click(function () {
        /**
         * 表格重载
         *    多条件查询
         */
        tableIns.reload({
            //设置需要传递给后端的参数
            where: { //设定异步数据接口的额外参数，任意设
                //通过文本框，设置传递的参数
                userName: $("[name='userName']").val() //用户名称
                ,email: $("[name='email']").val() //邮箱
                ,phone: $("[name='phone']").val() //手机号
            }
            ,page: {
                curr: 1 //重新从第 1 页开始
            }
        });
    });

    /**
     * 头部工具栏事件
     */
    table.on('toolbar(users)',function (data) {
        //添加用户
        if (data.event === "add"){
            //打开添加/修改用户的对话框
            openAddOrUpdateUserDialog();
        }else if (data.event === "del"){
            //删除多个用户
            deleteUsers(data);
        }
    });

    /**
     * 行工具栏监听
     */
    table.on('tool(users)',function (data) {
        //修改用户
        if (data.event === "edit"){
            openAddOrUpdateUserDialog(data.data.id);
        }else if(data.event === "del"){
            //删除单个用户
            //弹出确认框询问用户是否确认删除
            layer.confirm('确定要删除该记录吗?',{icon:3,title:"用户管理"},function (index) {
                //关闭确认框
                layer.close(index);
                //发送ajax请求删除记录
                $.ajax({
                    type:"post",
                    url: ctx + "/user/delete",
                    data: {ids: data.data.id},
                    success:function (result) {
                        //判断删除结果
                        if (result.code === 200){
                            //提示成功
                            layer.msg("删除成功！",{icon: 6});
                            //刷新表格
                            tableIns.reload();
                        }else {
                            //提示失败
                            layer.msg(result.msg,{icon: 5});
                        }
                    }
                })
            });
        }
    });

    /**
     * 打开添加/更新用户的对话框
     * @param userId
     */
    function openAddOrUpdateUserDialog(userId) {

        var title = "<h3>用户管理 - 添加用户</h3>";
        var url = ctx + "/user/toAddOrUpdateUserPage";

        if (userId){
            title = "<h3>用户管理 - 更新用户</h3>";
            url = url + "?id=" + userId;
        }

        // iframe层
        layui.layer.open({
            // 类型
            type: 2,
            // 标题
            title: title,
            // 宽高
            area: ['550px', '390px'],
            // url地址
            content: url,
            // 可以最大化与最小化
            maxmin:true
        });
    }

    /**
     * 删除多个用户(删除多条记录，在头工具栏)
     */
    function deleteUsers(data) {
        var checkStatus = table.checkStatus("userTable");
        // 获取所有被选中的记录对应的数据
        var userData = checkStatus.data;

        //判断用户是否选择了数据(选中行的数量大于0)
        if (userData.length < 1){
            layer.msg("请选择要删除的记录！",{icon:5});
        }

        layer.confirm('您确定要删除选中的记录吗?',{icon:3,title:"用户管理"},function (index) {
            layer.close(index);
            var ids = "ids=";
            for (var i = 0;i < userData.length; i++){
                if (i < userData.length - 1){
                    ids = ids + userData[i].id + "&ids=";
                }else {
                    ids = ids + userData[i].id;
                }
            }
            $.ajax({
                type:"post",
                url: ctx + "/user/delete",
                data:ids,
                dataType:"json",
                success:function (result) {
                    if (result.code === 200){
                        tableIns.reload();
                    }else {
                        layer.msg(data.msg,{icon:5});
                    }
                }
            })
        });
    }


});